<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.yaodian100.core.common.utils.ServerValue"%>
<%@ page import="org.apache.commons.lang.StringUtils"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@taglib prefix="pu" uri="/WEB-INF/tld/pageutil.tld" %>
<%@taglib prefix="mu" uri="/WEB-INF/tld/mallutil.tld" %>
<%@taglib prefix="pageable" uri="/WEB-INF/tld/pageable.tld" %>
<%@ taglib prefix="yaodian100" uri="http://www.yaodian100.com/jsp/yaodian100" %>
<%@taglib uri="http://java.sun.com/jstl/core_rt" prefix="c-rt"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@taglib uri="http://java.sun.com/jstl/fmt_rt" prefix="fmt-rt"%>
<c-rt:set var="imgDomain"><%=ServerValue.getImgDomain()%></c-rt:set>
<c-rt:set var="hostName" value='<%=ServerValue.getFrontHostname()%>'/>
<c-rt:set var="frontendContextPath"><%=ServerValue.getFrontContextPath()%></c-rt:set>
<link rel="stylesheet" href="/css/pdpagese_v4.css" type="text/css" media="screen,print" />
<script type="text/javascript">
  // 评价标签 mouseover 效果示意
  jQuery(function(){
      $('.comment-filter > li').each(function(){
          $(this).bind('mouseenter mouseleave', function(){
          $(this).toggleClass('current');
          });
     });
  })
</script>
 <!-- START 购买评论 container box -->
      	 
      	   <c-rt:if test="${empty productComment}">
           <!-- START  无任何评分时的状态 -->
           <div class="rating-summary">
           		<div class="score-marker">
                    <div class="score-num" style="display:none"><span>4.2</span><em>分</em></div>
                        <div class="s-box star-0-0">
                            <span class="sr1">&nbsp;</span><span class="sr2">&nbsp;</span><span class="sr3">&nbsp;</span><span class="sr4">&nbsp;</span><span class="sr5">&nbsp;</span>
                            <p>还没有用户评分</p>
                        </div>
                    </div>
                	<ul class="score-chart"><!-- 无任何评分时的长条图状态 -->
                        <li>好评<span>0</span>%<div class="score-bar"><div style="width:0%" class="score-probe"></div></div></li>
                        <li>中评<span>0</span>%<div class="score-bar"><div style="width:0%" class="score-probe"></div></div></li>
                        <li>差评<span>0</span>%<div class="score-bar"><div style="width:0%" class="score-probe"></div></div></li>
                    </ul>
           		<div class="rating-critics">
                    <c-rt:if test="${not empty commentCampaign}">
                    <p>发表评价并通过审核即可获得<span class="txt-rd">${commentCampaign.commentOthers}积分</span>，前3位评价并通过审核用户更可获得<span class="txt-rd">${commentCampaign.commentFirst3}积分</span>！(<a href="/help/3_coin.html#what" target="_blank">积分可以干什么</a>)
                    </c-rt:if>
                </div>
                <ul class="size-survey" style="display:none"><!-- 无尺寸评分时 hide 起来 -->
                        <li>0%<strong>觉得偏大</strong></li>
                        <li>0%<strong>觉得适中</strong></li>
                        <li>0%<strong>觉得偏小</strong></li>
                 </ul>
           </div>
           <div class="comment-wall">
           <ul class="comment-filter">
                	<li class="up" id="All"><a href="javascript:void(0);" onclick="loadProdComment('All');">全部评价(0)</a></li>
                  <li class="" id="Good"><a href="javascript:void(0);" onclick="loadProdComment('Good');">好评(0)</a></li>
                  <li class="" id="Mid"><a href="javascript:void(0);" onclick="loadProdComment('Mid');">中评(0)</a></li>
                  <li class="" id="Low"><a href="javascript:void(0);" onclick="loadProdComment('Low');">差评(0)</a></li>
                </ul>
                <a href="javascript:;" id="addMyComment" class="to-comment">我要评价</a><span class="to-comment-hint">评价均来自购买过此商品的用户</span>
                <p align="center">暂无评价</p>
            </div>    
                
           <!-- END  无任何评分时的状态 -->
           </c-rt:if>
           <c-rt:if test="${not empty productComment}">
           
           <div class="rating-summary">
       		 <div class="rating-scores">
                	<div class="score-marker">
                    	<div class="score-num">${productComment.avgScore}<em>分</em></div>
                        <div class="s-box star-${productComment.intAvgScore}-${star}">
                            <span class="sr1">&nbsp;</span><span class="sr2">&nbsp;</span><span class="sr3">&nbsp;</span><span class="sr4">&nbsp;</span><span class="sr5">&nbsp;</span>
                            <p>${temp} 共有<em>${productComment.totalRecord}</em>次评分</p>
                        </div>
                    </div>
                    <!-- endof .score-marker -->
                	<ul class="score-chart">
                        <li>好评<span>${productComment.goodScore}</span>%<div class="score-bar"><div style="width:${productComment.goodScore}%" class="score-probe"></div></div></li>
                        <li>中评<span>${productComment.midScore}</span>%<div class="score-bar"><div style="width:${productComment.midScore}%" class="score-probe"></div></div></li>
                        <li>差评<span>${productComment.lowScore}</span>%<div class="score-bar"><div style="width:${productComment.lowScore}%" class="score-probe"></div></div></li>
                    </ul>
                    <!-- endof .score-chart -->
                </div>
                <div class="rating-critics">
                    <p>前三位评价用户：<br />${last3Comment}</p>
                    <c-rt:if test="${not empty commentCampaign}">
                    <p>发表评价并通过审核即可获得<span class="txt-rd">${commentCampaign.commentOthers}积分</span>，前3位评价并通过审核用户更可获得<span class="txt-rd">${commentCampaign.commentFirst3}积分</span>！(<a href="/help/3_coin.html#what" target="_blank">积分可以干什么</a>)
                    </c-rt:if>
                </div>
                <!-- endof .rating-scores -->
                <c-rt:if test="${product.commentSize == 'Y'}">
                <div class="size-survey">
                	<ul>
                        <li>${productComment.bigSize}%<strong>觉得偏大</strong></li>
                        <li>${productComment.midSize}%<strong>觉得适中</strong></li>
                        <li>${productComment.smallSize}%<strong>觉得偏小</strong></li>
                    </ul>
             		</div>
             		</c-rt:if>
             		<!-- endof .size-survey -->
           </div>
            <div class="comment-wall">
           		<ul class="comment-filter">
                	<li class="up" id="All"><a href="javascript:void(0);" onclick="loadProdComment('All');">全部评价(${productComment.totalRecord})</a></li>
                    <li class="" id="Good"><a href="javascript:void(0);" onclick="loadProdComment('Good');">好评(${productComment.goodRecord})</a></li>
                    <li class="" id="Mid"><a href="javascript:void(0);" onclick="loadProdComment('Mid');">中评(${productComment.midRecord})</a></li>
                    <li class="" id="Low"><a href="javascript:void(0);" onclick="loadProdComment('Low');">差评(${productComment.lowRecord})</a></li>
                </ul>
                <a href="javascript:;" id="addMyComment" class="to-comment">我要评价</a><span class="to-comment-hint">评价均来自购买过此商品的用户</span>
               		<!-- <p align="center"><img class="comment-loading" src="/images/loading.gif" width="32" height="32" /></p>-->
               		<s:if test="commentProductList.size == 0"><p align="center">暂无评价</p></s:if>
                    <c-rt:forEach items="${commentProductList}" var="comment" varStatus="rows_index">
                    <div class="comment tb-${rows_index.count % 2 == 0 ? 'a' : 'b'}">
                        <div class="comment-title"><strong>${comment.subject}</strong>
                            <div class="s-box star-${comment.score}-0">
                                <span class="sr1">&nbsp;</span><span class="sr2">&nbsp;</span><span class="sr3">&nbsp;</span><span class="sr4">&nbsp;</span><span class="sr5">&nbsp;</span>
                            </div>
                            <span class="comment-date"><fmt-rt:formatDate value="${comment.approveDate}" pattern="yyyy-MM-dd HH:mm" type="both"/></span>
                            <span class="commentator">评论自：<em>${comment.loginId}</em></span>
                        </div>
                        <p>${comment.content}</p>
                        <p class="comment-info">商品属性：${comment.specName}<span class="prod-shipto">商品送至：${comment.receiverProvince}</span></p>
                        <c-rt:set var="shareLinkPath" value='${hostName}${frontendContextPath}/product/product.do?productId=${product.productId}'/>
     										<c-rt:set var="happyText" value='${product.productName} ${comment.subject}'/>
                        <div class="share-to" onmouseover="$('#share-list-${rows_index.count}').show();" onmouseout="$('#share-list-${rows_index.count}').hide();">
                          <div id="share-list-${rows_index.count}" class="share-list" style="display:none">
                          	<div class="share-mask">&nbsp;</div>
                          	<div class="share-kaixi"><a href="javascript:traceVirtualPage('/product.do?productId=${product.productId}&hpp=kaixinmck_order');window.open('http://www.kaixin001.com/repaste/share.php?rtitle='+encodeURIComponent('我在 耀点100 网站买了这件促销商品很不错，推荐给大家！')+'&rurl='+encodeURIComponent('${shareLinkPath}')+'&rcontent=' + encodeURIComponent('${fn:escapeXml(happyText)}') ,'_blank','scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes'); void 0;" title="分享到开心网！" >开心网</a></div>
                         		<div class="share-renren"><a href="javascript:traceVirtualPage('/product.do?productId=${product.productId}&hpp=renrenmck_order');void((function(s,d,e){var f='http://share.renren.com/share/buttonshare?link=',u='${shareLinkPath}&hpp=renren',l='',p=[e(u),'&title=',e(l)].join('');function a(){if(!window.open([f,p].join(''),'xnshare',['toolbar=0,status=0,resizable=1,width=626,height=436,left=',(s.width-626)/2,',top=',(s.height-436)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else a();})(screen,document,encodeURIComponent));" title="分享到人人网！">人人网</a></div>
                          	<div class="share-qq"><a href="javascript:traceVirtualPage('/product.do?productId=${product.productId}&hpp=qqmck_order');postToWb${rows_index.count}();" title="分享到腾讯！">腾讯</a></div>
                          	<script type="text/javascript">function postToWb${rows_index.count}(){var _t = encodeURI('${fn:escapeXml(happyText)}');var _url = encodeURIComponent('${shareLinkPath}');var _appkey = encodeURI("67523a5364aa43bdb6e8d18f93ac5524");var _pic = encodeURI($('.pimage img').attr('src'));var _site = '${hostName}';var _u = 'http://v.t.qq.com/share/share.php?url='+_url+'&appkey='+_appkey+'&site='+_site+'&pic='+_pic+'&title='+_t;window.open( _u,'', 'width=700, height=680, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, location=yes, resizable=no, status=no' );}</script>
                          	<div class="share-weibo"><a href="javascript:traceVirtualPage('/product.do?productId=${product.productId}&hpp=sinamck');window.open('http://v.t.sina.com.cn/share/share.php?appkey=732367816&title='+encodeURIComponent('我在 耀点100 网站发现这件促销商品很不错，推荐给大家！${shareLinkPath}${fn:escapeXml(happyText)}') ,'_blank','scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes'); void 0;" title="分享到新浪微博！" >新浪微博</a></div>
                        	</div>
                    		</div>
                    </div>
                    </c-rt:forEach>
                    <s:if test="commentProductList.size > 0">
						                   
                    </s:if>
                    
                    <p class="page-change">
											<a href="javascript:void(0);" class="f-rt">第${pager.currentPage+1}頁，共${pager.pageSize}頁 </a>
											<c-rt:choose>
									    	<c-rt:when test="${pager.pageSize==1 || pager.currentPage==0}">
													<span class="a-no">&lt; 上一页</span> |
											 	</c-rt:when>
												<c-rt:otherwise>
													<a href="javascript:void(0);" class="a-togo" onclick="toPage('${commentTp}','${pager.currentPage-1}');">&lt; 上一页</a> |
												</c-rt:otherwise>
											</c-rt:choose>		
											<c-rt:forEach begin="${pager.startPage}" end="${pager.endPage}" var="i">
												<c-rt:choose>
													<c-rt:when test="${pager.currentPage+1 ==i}">
														<b class="pg-now">${i}</b>
													</c-rt:when>
													<c-rt:otherwise>
														<a href="javascript:void(0);" onclick="toPage('${commentTp}','${i-1}')">${i}</a>
													</c-rt:otherwise>
												</c-rt:choose>
											</c-rt:forEach>
											<c-rt:choose>
												<c-rt:when test="${pager.currentPage+1 == pager.pageSize}">
													<span class="a-no"> | 下一页 &gt;</span>
												</c-rt:when>
												<c-rt:otherwise>
													 | <a href="javascript:void(0);" class="a-togo" onclick="toPage('${commentTp}','${pager.currentPage+1}');">下一页 &gt;</a>
												</c-rt:otherwise>
											</c-rt:choose>
		 								</p>		
			</div>
      <!-- END   购买评论 container box -->
 		</c-rt:if>
